<!-- 个人信息修改 -->
<template>
	<view class="personalInfoEdit">
<!-- 		<view class="headPortrait" >
			<u-upload
				class="uploadBtn"
				:fileList="personInfoData.fileList"
				name="1"
				multiple
				@afterRead="afterRead($event)"
				@delete="deletePic($event)"
				:maxCount="1"
				:deletable="false"
			></u-upload>
			<text>上传个人照片</text>
			
			
		</view> -->
		<view class="headPortrait">
			<image class="headImage" @click="avatarClick" :src="personInfoData.info.headImage" mode=""></image>
			<text class="editTitle" @click="avatarClick">上传个人照片</text>
		</view>
		<view class="card">
			<view class="itemInfo" @click="showModalFun('realName')">
				<text>真实姓名</text>
				<u-input class="inputBox" disabled disabled-color="#fff" placeholder="请输入内容" border="none" v-model="personInfoData.info.realName"></u-input>
			</view>
			<view class="itemInfo" @click="showModalFun('wechatNumber')">
				<text>微信号</text>
				<u-input class="inputBox" placeholder="请输入内容" border="none" v-model="personInfoData.info.wechatNumber"></u-input>
			</view>
			<view class="itemInfo" @click="showsSelect('sex')">
				<text>性别</text>
				<u-input placeholder="请选择" class="inputBox" border="none" disabled disabledColor="#ffffff" v-model="personInfoData.info.gender"></u-input>
			</view>
			<view class="itemInfo" @click="showModalFun('phone')">
				<text>手机号</text>
				<u-input placeholder="请输入内容" class="inputBox" border="none"  v-model="personInfoData.info.phone"></u-input>
			</view>
			
		
			<view class='itemInfo' @click="showsSelect('yearOfBirth')">
				<text>出生年份</text>
				<u-input placeholder="请选择" class="inputBox" border="none" disabled disabledColor="#ffffff" v-model="personInfoData.info.ageYear"></u-input>
			</view>
			<view class='itemInfo' @click="showsSelect('educationBackground')">
				<text>最高学历</text>
				<u-input placeholder="请选择" class="inputBox" border="none" disabled disabledColor="#ffffff" v-model="personInfoData.info.educationName"></u-input>
			</view>
			<view class='itemInfo' @click="showsSelect('yearsOfWorking')">
				<text>工作年限</text>
				<u-input placeholder="请选择" class="inputBox" border="none" disabled disabledColor="#ffffff" v-model="personInfoData.info.workExperienceTimeName"></u-input>
			</view>
			<view class='itemInfo' @click="showsSelect('isCertification')">
				<text>是否是国家认证人才</text>
				<u-input placeholder="请选择" class="inputBox" border="none" disabled disabledColor="#ffffff" v-model="personInfoData.info.isCertificationName"></u-input>
			</view>
		
		</view>
		
		
		<u-action-sheet
			:show="selectFlag.showSex"
			:actions="selectFlag.actions"
			title="请选择"
			description=""
			@close="selectFlag.showSex = false"
			@select="sexSelect">
		</u-action-sheet>
		
		<u-datetime-picker
			:minDate="14539098"
			ref="datetimePicker"
			:show="personInfoData.birthdayShow"
			v-model="personInfoData.time"
			mode="date"
			@confirm="confirmDate"
			@cancel="personInfoData.birthdayShow = false"
		></u-datetime-picker>
		
		<u-modal :show="personInfoData.showModal" :title="personInfoData.modalTitle" :showCancelButton='true' @cancel="cancelModal" @confirm="confirmModal">
			<view class="slot-content contentBox">
				<u--form :model="personInfoData.form" ref="form1" labelWidth="100">
					<u-form-item class="formItem" label="" prop="title" v-if="personInfoData.type==='realName'">
						<template #label>
							<view class="r-flex-between-center">
								<view class="labelName">
									<text>真实姓名：</text>
								</view>
							</view>
						</template>
						<u--input v-model="personInfoData.form.title" border="none" placeholder="请填写真实姓名"></u--input>
					</u-form-item>
					<u-form-item class="formItem" label="" prop="title" v-if="personInfoData.type==='wechatNumber'">
						<template #label>
							<view class="r-flex-between-center">
								<view class="labelName">
									<text>微信号：</text>
								</view>
							</view>
						</template>
						<u--input v-model="personInfoData.form.title" border="none" placeholder="请填写微信号"></u--input>
					</u-form-item>
					<u-form-item class="formItem" label="" prop="title" v-if="personInfoData.type==='phone'">
						<template #label>
							<view class="r-flex-between-center">
								<view class="labelName">
									<text>手机号：</text>
								</view>
							</view>
						</template>
						<u--input v-model="personInfoData.form.title" border="none" placeholder="请填写手机号"></u--input>
					</u-form-item>
				</u--form>
			</view>
		</u-modal>
	</view>
</template>

<script setup lang="ts">
	import { ref,reactive,getCurrentInstance} from 'vue'
	const {proxy} = getCurrentInstance()
	import {useRouter} from 'uni-mini-router'
	let router = useRouter()
	import {getEdu,getWork} from '@/utlis/common.js'
	let personInfoData = reactive({
		modalTitle:'',
		showModal:false,
		time:'',
		form:{
			title:'',
		},
		type:'',
		
		minDate: new Date('1900-01-01').getTime(), // 确保传递一个数字类型的 Unix 时间戳
		birthdayShow:false,
		info:{},
		name:'',
		sex:'',
		fileList:[]
	})
	
	let selectFlag = reactive({
		showSex:false,
		actions:[],
		sexActions:[
			{name: '男'},
			{name: '女'},
		],
		educationBackgroundAction:[
			{name: '初中及以下',val:0},
			{name: '高中（中专）',val:1},
			{name: '大学（本专科）',val:2},
			{name: '硕士及以上',val:3},
			{name: '高中（中专）',val:1},
		],
		yearsOfWorking:[
			{name: '1年以内',val:0},
			{name: '1-3年',val:1},
			{name: '3-5年',val:2},
			{name: '5-8年',val:3},		
			{name: '8年以上',val:4},
		],
		isCertificationActions:[
			{name: '否',val:0},
			{name: '是',val:1},
		],
	})

	
	let sexSelect = (e)=>{
		if(personInfoData.type == 'sex'){
			personInfoData.info.gender = e.name
		}else if(personInfoData.type == 'educationBackground'){		
			personInfoData.info.education = e.val
			personInfoData.info.educationName = e.name	
		}else if(personInfoData.type == 'yearsOfWorking'){
			personInfoData.info.workExperienceTime = e.val
			personInfoData.info.workExperienceTimeName = e.name	
		}else if(personInfoData.type == 'isCertification'){
			personInfoData.info.isCertification = e.val
			personInfoData.info.isCertificationName = e.name	
		}
		
		
		
		editFun()
	}
	
	let showModalFun = (type)=>{
		personInfoData.type = type
		
		if(type == 'realName'){
			personInfoData.form.title = personInfoData.info.realName
			personInfoData.modalTitle ="真实姓名"
			personInfoData.showModal = true
		}else if(type == 'wechatNumber'){
			personInfoData.form.title = personInfoData.info.wechatNumber
			personInfoData.modalTitle ="微信号"
			personInfoData.showModal = true
		}else if(type == 'phone'){
			personInfoData.form.title = personInfoData.info.phone
			personInfoData.modalTitle ="手机号"
			personInfoData.showModal = true
		}
		
		
	}
	let confirmModal=()=>{
		if(personInfoData.type == 'realName'){
			personInfoData.info.realName = personInfoData.form.title
		}else if(personInfoData.type == 'wechatNumber'){
			personInfoData.info.wechatNumber = personInfoData.form.title
		}else if(personInfoData.type == 'phone'){
			personInfoData.info.phone = personInfoData.form.title
		}
		editFun()
		
	}
	let cancelModal = ()=>{
		personInfoData.showModal = false
	}
	
	let confirmDate = (val)=>{
		const timeFormat = uni.$u.timeFormat
		personInfoData.time = timeFormat(val.value, 'yyyy-mm-dd')
		personInfoData.info.ageYear = personInfoData.time
		personInfoData.birthdayShow = false
		editFun()
	}
	let showsSelect = (type)=>{
		personInfoData.type = type
		switch (type){
			case 'sex':
				selectFlag.actions = selectFlag.sexActions
				selectFlag.showSex = true
				break;
			case 'yearOfBirth':
				personInfoData.birthdayShow = true
				// selectFlag.actions = selectFlag.yearOfBirthAction
				// selectFlag.showSex = true
				break;
			case 'educationBackground':
				selectFlag.actions = selectFlag.educationBackgroundAction
				selectFlag.showSex = true
				break;
			case 'yearsOfWorking':
				selectFlag.actions = selectFlag.yearsOfWorking
				selectFlag.showSex = true
				break;
			case 'isCertification':
				selectFlag.actions = selectFlag.isCertificationActions
				selectFlag.showSex = true
				break;	
				
			default:
				break;
		}
	}
	let avatarClick = () => {
		uni.chooseImage({
			success: (chooseImageRes) => {
				const tempFilePaths = chooseImageRes.tempFilePaths;
				uni.uploadFile({
					url: proxy.$uploadUrl + proxy.$api.uploadFile,
					filePath: tempFilePaths[0],
					name: 'file',
					formData: {
						'file': tempFilePaths[0],
					},
					success: (uploadFileRes) => {
						personInfoData.info.headImage =  JSON.parse(uploadFileRes.data).result;
						editFun()
	
					}
				});
			}
		});
	}

	// 获取个人简历详情
	const meiyeRecruitHunterInfo2DetailsFun = ()=>{
		//获取详情
		proxy.$req('GET', proxy.$api.meiyeRecruitHunterInfo2Details).then((res) => {
			if(res.code === 200){
				res.result.educationName = getEdu(res.result.education)
				res.result.workExperienceTimeName = getWork(res.result.workExperienceTime)
				
				let idx = selectFlag.isCertificationActions.findIndex(el=>el.val == res.result.isCertification) 
				if(idx!=-1){
					res.result.isCertificationName = selectFlag.isCertificationActions[idx].name
				}
				personInfoData.fileList = res.result.headImage?[{url:res.result.headImage}]:[]
				personInfoData.info = res.result
				
			}
		})
	}
	// 修改数据
	const editFun = ()=>{
		proxy.$req('POST', proxy.$api.meiyeRecruitHunterInfo2edit,personInfoData.info).then((res) => {
			if(res.code === 200){
				cancelModal()
				meiyeRecruitHunterInfo2DetailsFun()
				// router.push({
				// 	name: 'onlineResume'
				// })
			}
		})
	}
	meiyeRecruitHunterInfo2DetailsFun()
	
	const afterRead = (e) => {
		
		const item = e.file[0];
		personInfoData.fileList = [{
			...item,
			//提示上传中
			status: 'uploading',
			message: '上传中'
		}];
		uni.uploadFile({
			url: proxy.$uploadUrl + proxy.$api.uploadFile,
			filePath: e.file[0].url,
			name: 'file',
			formData: {
				file: e.file[0].url,
			},
			success: (uploadFileRes) => {
				// console.log(uploadFileRes);
				let result = JSON.parse(uploadFileRes.data).result
				personInfoData.fileList.splice(
					0,
					1,
					Object.assign(item, {
						status: 'success',
						message: '上传成功',
						url: result,
					})
				);
				
				editFun()
			},
			complete() { }
		});
	}
	const deletePic = (e) => {
		
		personInfoData.fileList.splice(event.index, 1)
		editFun()
		
	}

</script>
<style lang="scss" scoped>
	page{
		background:#f6f6f6;
	}
	
	.card{
		background:#fff;
		box-sizing: border-box;
		border: 2rpx solid #fff;
		margin: 30rpx auto;
		padding: 24rpx;
		background:#fff;
		border-radius: 24rpx;
		box-shadow: 8rpx 8rpx 32rpx 0rpx rgba(0, 0, 0, 0.04);
		
	}
	.personalInfoEdit{
		// background:#f6f6f6;
		padding:0 30rpx;
		.itemInfo{
			display:flex;
			// flex-direction: column;
			justify-content: space-between;
			align-items: center;
			padding:30rpx 0;
			border-bottom: 1rpx solid #eeeeeead;
			text{
				color: rgba(0, 0, 0, 1);
				font-size: 32rpx;
				
			}
			:deep(.inputBox){
				background-color:#fff;		
				.uni-input-input,.uni-input-placeholder{
					text-align: right;
					// text-align: center !important;
					color:#8E8E93;
					font-size:30rpx;
				}
			} 
		}
		:deep(.headPortrait){
			display:flex;
			flex-direction: column;
			align-items: center;
			// .uploadBtn .u-upload__button{
			// 	border-radius: 50%;
			// }
			.headImage{
				width:160rpx;
				height:160rpx;
				border-radius: 50%;
				margin-bottom:10rpx;
			}
			
			text{
				color:#8E8E93;
			}
		}	
		.otherBox{
			display:flex;
			align-items: center;
		}
	}
</style>